<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
        <script src="./jquery.objectlist-1.0.js" type="text/javascript"></script>
        <script src="./test.js" type="text/javascript"></script>

        <link href="./objectlist.css" rel="stylesheet" type="text/css">
        
        <style>
        	button {
        		display: block;}
        	#objectlist {
        		float: left;}
        	.controls {
        		display: inline-block;
        		width: 450px;
        		padding-left: 10px;}
        	.controls * {
        		margin-bottom: 5px;}
        	.inputField * {
        		display: inline-block;}
        	.inputField input {
        		width: 100px;}
        </style>
    </head>
    <div id="objectlist"></div>
    <div class="controls">
    	<button id="add">Add object</button>
    	<button id="select_all">Select all</button>
	    <button id="deselect_all">Deselect all</button>
	    <button id="clear">Clear</button>
	    <button id="blank">Blank</button>
	    <button id="select_object">Select added object</button>
	    <button id="get_selected">Get selected</button>
	    <div class="inputField">
	    	<input  id="object_id" type="text" />
	    	<button id="get">Get object</button>
	    </div>
	    <button id="delete">Delete</button>
	</div>
</html>
